import { ref } from 'vue'

/**
 * 主题配置接口
 */
export interface ThemeConfig {
	name: string
	value: string
	
	// 🎨 主色系
	primaryGradient: string        // 主渐变色
	primaryColor: string            // 主色
	primaryLight: string            // 主色-浅
	primaryDark: string             // 主色-深
	
	// 🎨 辅助色系
	secondaryColor: string          // 辅助色
	secondaryLight: string          // 辅助色-浅
	
	// 🎨 中性色系
	textPrimary: string             // 主要文字
	textSecondary: string           // 次要文字
	textTertiary: string            // 三级文字
	textPlaceholder: string         // 占位文字
	
	borderColor: string             // 边框颜色
	borderLight: string             // 浅边框
	
	// 🎨 背景色系
	bgPrimary: string               // 主背景
	bgSecondary: string             // 次背景
	bgTertiary: string              // 三级背景
	bgCard: string                  // 卡片背景
	
	// 🎨 功能色/语义色
	successColor: string            // 成功色
	warningColor: string            // 警告色
	errorColor: string              // 错误色
	infoColor: string               // 信息色
	
	// 🎨 阴影
	cardShadow: string              // 卡片阴影色
	buttonShadow: string            // 按钮阴影色
	hoverShadow: string             // 悬浮阴影色
}

/**
 * 预设主题配置
 */
const themeConfigs: Record<string, ThemeConfig> = {
	default: {
		name: '默认风格',
		value: 'default',
		// 主色系 - 粉蓝渐变（现代活力）
		primaryGradient: 'linear-gradient(90deg, #FC466B 0%, #3F5EFB 100%)',
		primaryColor: '#8B5CF6',
		primaryLight: '#A78BFA',
		primaryDark: '#7C3AED',
		// 辅助色系
		secondaryColor: '#EC4899',
		secondaryLight: '#F472B6',
		// 中性色系
		textPrimary: '#1e293b',
		textSecondary: '#475569',
		textTertiary: '#64748b',
		textPlaceholder: '#A78BFA',
		borderColor: '#fdf2f8',
		borderLight: '#fef7ff',
		// 背景色系
		bgPrimary: '#ffffff',
		bgSecondary: '#fef7ff',
		bgTertiary: '#fdf2f8',
		bgCard: '#ffffff',
		// 功能色
		successColor: '#10b981',
		warningColor: '#f59e0b',
		errorColor: '#ef4444',
		infoColor: '#8B5CF6',
		// 阴影
		cardShadow: 'rgba(139, 92, 246, 0.08)',
		buttonShadow: 'rgba(139, 92, 246, 0.25)',
		hoverShadow: 'rgba(139, 92, 246, 0.15)'
	},
	lime: {
		name: '柠檬绿',
		value: 'lime',
		// 主色系 - 黄绿渐变（活力柠檬风格）
		primaryGradient: 'linear-gradient(90deg, #f8ff00 0%, #3ad59f 100%)',
		primaryColor: '#84cc16',
		primaryLight: '#a3e635',
		primaryDark: '#65a30d',
		// 辅助色系
		secondaryColor: '#22c55e',
		secondaryLight: '#4ade80',
		// 中性色系
		textPrimary: '#1e293b',
		textSecondary: '#475569',
		textTertiary: '#64748b',
		textPlaceholder: '#a3e635',
		borderColor: '#f7fee7',
		borderLight: '#fefce8',
		// 背景色系
		bgPrimary: '#ffffff',
		bgSecondary: '#fefce8',
		bgTertiary: '#f7fee7',
		bgCard: '#ffffff',
		// 功能色
		successColor: '#10b981',
		warningColor: '#f59e0b',
		errorColor: '#ef4444',
		infoColor: '#84cc16',
		// 阴影
		cardShadow: 'rgba(132, 204, 22, 0.08)',
		buttonShadow: 'rgba(132, 204, 22, 0.25)',
		hoverShadow: 'rgba(132, 204, 22, 0.15)'
	},
	cyan: {
		name: '清新薄荷',
		value: 'cyan',
		// 主色系 - 蓝绿渐变（清新薄荷风格）
		primaryGradient: 'linear-gradient(90deg, #00C9FF 0%, #92FE9D 100%)',
		primaryColor: '#22d3ee',
		primaryLight: '#67e8f9',
		primaryDark: '#0891b2',
		// 辅助色系
		secondaryColor: '#34d399',
		secondaryLight: '#6ee7b7',
		// 中性色系
		textPrimary: '#374151',
		textSecondary: '#6b7280',
		textTertiary: '#9ca3af',
		textPlaceholder: '#67e8f9',
		borderColor: '#ecfdf5',
		borderLight: '#f0fdfa',
		// 背景色系
		bgPrimary: '#ffffff',
		bgSecondary: '#f0fdfa',
		bgTertiary: '#ecfdf5',
		bgCard: '#ffffff',
		// 功能色
		successColor: '#10b981',
		warningColor: '#f59e0b',
		errorColor: '#ef4444',
		infoColor: '#22d3ee',
		// 阴影
		cardShadow: 'rgba(34, 211, 238, 0.08)',
		buttonShadow: 'rgba(34, 211, 238, 0.20)',
		hoverShadow: 'rgba(34, 211, 238, 0.12)'
	},
	purple: {
		name: '梦幻紫',
		value: 'purple',
		// 主色系 - 紫色渐变（梦幻优雅）
		primaryGradient: 'linear-gradient(90deg, #efd5ff 0%, #515ada 100%)',
		primaryColor: '#8b5cf6',
		primaryLight: '#c4b5fd',
		primaryDark: '#515ada',
		// 辅助色系
		secondaryColor: '#a855f7',
		secondaryLight: '#c4b5fd',
		// 中性色系
		textPrimary: '#1e293b',
		textSecondary: '#475569',
		textTertiary: '#64748b',
		textPlaceholder: '#c4b5fd',
		borderColor: '#f3f4f6',
		borderLight: '#faf5ff',
		// 背景色系
		bgPrimary: '#ffffff',
		bgSecondary: '#faf5ff',
		bgTertiary: '#f3e8ff',
		bgCard: '#ffffff',
		// 功能色
		successColor: '#10b981',
		warningColor: '#f59e0b',
		errorColor: '#ef4444',
		infoColor: '#8b5cf6',
		// 阴影
		cardShadow: 'rgba(139, 92, 246, 0.08)',
		buttonShadow: 'rgba(139, 92, 246, 0.25)',
		hoverShadow: 'rgba(139, 92, 246, 0.15)'
	},
	pink: {
		name: '梦幻粉',
		value: 'pink',
		// 主色系 - 粉蓝渐变（柔和梦幻）
		primaryGradient: 'radial-gradient(circle, rgba(238, 174, 202, 1) 0%, rgba(148, 187, 233, 1) 100%)',
		primaryColor: '#EEAECA',
		primaryLight: '#F5C5DB',
		primaryDark: '#E18DB7',
		// 辅助色系
		secondaryColor: '#94BBE9',
		secondaryLight: '#B5D4F5',
		// 中性色系
		textPrimary: '#1e293b',
		textSecondary: '#475569',
		textTertiary: '#64748b',
		textPlaceholder: '#94a3b8',
		borderColor: '#e2e8f0',
		borderLight: '#f1f5f9',
		// 背景色系
		bgPrimary: '#ffffff',
		bgSecondary: '#fef3f9',
		bgTertiary: '#fce7f3',
		bgCard: '#ffffff',
		// 功能色
		successColor: '#10b981',
		warningColor: '#f59e0b',
		errorColor: '#ef4444',
		infoColor: '#94BBE9',
		// 阴影
		cardShadow: 'rgba(238, 174, 202, 0.08)',
		buttonShadow: 'rgba(238, 174, 202, 0.35)',
		hoverShadow: 'rgba(148, 187, 233, 0.15)'
	},
	dark: {
		name: '暗夜黑',
		value: 'dark',
		// 主色系 - 深色现代科技感
		primaryGradient: 'linear-gradient(135deg, #22223b 0%, #3a3550 60%, #6366f1 100%)',
		primaryColor: '#6366f1',
		primaryLight: '#818cf8',
		primaryDark: '#22223b',
		// 辅助色系
		secondaryColor: '#818cf8',
		secondaryLight: '#a5b4fc',
		// 中性色系 - 暗色模式反转
		textPrimary: '#f8fafc',
		textSecondary: '#dbeafe',
		textTertiary: '#94a3b8',
		textPlaceholder: '#64748b',
		borderColor: '#334155',
		borderLight: '#334155',
		// 背景色系 - 保证充分对比度
		bgPrimary: '#181926',
		bgSecondary: '#23263A',
		bgTertiary: '#242742',
		bgCard: '#22223b',
		// 功能色 - 增强在暗色下的辨识度
		successColor: '#4ade80',
		warningColor: '#fbbf24',
		errorColor: '#f87171',
		infoColor: '#60a5fa',
		// 阴影 - 暗色下弱一点的冷色投影
		cardShadow: 'rgba(30, 41, 59, 0.42)',
		buttonShadow: 'rgba(99, 102, 241, 0.32)',
		hoverShadow: 'rgba(99, 102, 241, 0.18)'
	}
}

/**
 * 当前主题key
 */
const currentTheme = ref<string>('default')

/**
 * 初始化主题
 */
const initTheme = () => {
	const savedTheme = uni.getStorageSync('appTheme')
	if (savedTheme && themeConfigs[savedTheme]) {
		currentTheme.value = savedTheme
	}
}

/**
 * 设置主题
 * @param theme 主题key
 */
const setTheme = (theme: string) => {
	if (themeConfigs[theme]) {
		currentTheme.value = theme
		uni.setStorageSync('appTheme', theme)
	}
}

/**
 * 获取当前主题配置
 */
const getThemeConfig = () => {
	return themeConfigs[currentTheme.value] || themeConfigs.default
}

/**
 * 获取主题样式对象
 * 用于动态绑定样式，兼容旧版本的字段
 */
const getThemeStyles = () => {
	const config = themeConfigs[currentTheme.value] || themeConfigs.default
	return {
		// 🎨 主色系
		primaryGradient: config.primaryGradient,
		primaryColor: config.primaryColor,
		primaryLight: config.primaryLight,
		primaryDark: config.primaryDark,
		
		// 🎨 辅助色系
		secondaryColor: config.secondaryColor,
		secondaryLight: config.secondaryLight,
		
		// 🎨 中性色系
		textPrimary: config.textPrimary,
		textSecondary: config.textSecondary,
		textTertiary: config.textTertiary,
		textPlaceholder: config.textPlaceholder,
		border: config.borderColor,
		borderColor: config.borderColor,
		borderLight: config.borderLight,
		borderPrimary: config.borderColor, // 兼容旧版
		
		// 🎨 背景色系
		bgPrimary: config.bgPrimary,
		bgSecondary: config.bgSecondary,
		bgTertiary: config.bgTertiary,
		bgCard: config.bgCard,
		bgGradient: `linear-gradient(to bottom, ${config.bgSecondary} 0%, ${config.bgTertiary} 100%)`,
		
		// 🎨 强调背景和边框（用于统计卡片等）
		accentColor: config.primaryLight, // 兼容旧版
		accentBg: `linear-gradient(135deg, ${config.primaryColor}10 0%, ${config.secondaryColor}10 100%)`,
		accentBorder: `${config.primaryColor}33`,
		
		// 🎨 功能色
		successColor: config.successColor,
		warningColor: config.warningColor,
		errorColor: config.errorColor,
		infoColor: config.infoColor,
		
		// 🎨 阴影样式
		shadowSm: `0 2rpx 8rpx ${config.cardShadow}`,
		shadowMd: `0 4rpx 12rpx ${config.cardShadow}`,
		shadowLg: `0 8rpx 24rpx ${config.cardShadow}`,
		cardBoxShadow: `0 4rpx 20rpx ${config.cardShadow}`,
		buttonBoxShadow: `0 8rpx 24rpx ${config.buttonShadow}`,
		hoverBoxShadow: `0 8rpx 32rpx ${config.hoverShadow}`,
		activeShadow: `0 8rpx 20rpx ${config.buttonShadow}`,
		focusBoxShadow: `0 0 0 6rpx ${config.primaryColor}1a`,
		
		// 🎨 边框样式
		cardBorder: `1px solid ${config.borderLight}`
	}
}

/**
 * 获取所有主题选项
 */
const getThemeOptions = () => {
	return Object.keys(themeConfigs).map(key => ({
		value: key,
		name: themeConfigs[key].name,
		previewBg: themeConfigs[key].primaryGradient,
	}))
}

// 初始化主题
initTheme()

// 导出
export { currentTheme, setTheme, getThemeConfig, getThemeStyles, getThemeOptions }



